﻿<link href="Content/layui/css/layui.css" rel="stylesheet" />
<style type="text/css">
    /*.layui-input {
    width:120px;
    }*/
    .layui-form-item{
        margin-bottom:5px;
    }
</style>
<div class="main" style="padding:10px">
        <div class="container">
            <div class="main-content">
                    <div class="">
                        <form class="layui-form layui-form-pane" action="">
                            <div class="layui-form-item">
                                <div class="layui-inline">
                                    <label class="layui-form-label">单号</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="date"  autocomplete="off" class="layui-input" style="width:150px">
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label">客户</label>
                                    <div class="layui-input-inline" style="width:120px !important">
                                        <input type="text" name="number" autocomplete="off" class="layui-input" style="width:150px">
                                    </div>
                                    <!--<div class="layui-form-mid">-</div>-->
                                    <div class="layui-input-inline">
                                        <select name="interest" lay-filter="aihao">
                                            <option value=""></option>
                                            <option value="0">零售客户</option>
                                            <option value="1">测试客户</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-inline">
                                    <label class="layui-form-label">制单日期</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="date" id="date" autocomplete="off" class="layui-input" style="width:150px">
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label">制单</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="number" autocomplete="off" class="layui-input" style="width:150px">
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label">审核人</label>
                                    <div class="layui-input-inline">
                                        <input type="text" name="number" autocomplete="off" class="layui-input" style="width:150px">
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item layui-form-text">
                                <label class="layui-form-label">备注</label>
                                <div class="layui-input-block">
                                    <textarea placeholder="请输入内容" class="layui-textarea"></textarea>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <button class="layui-btn layui-btn-sm lay-btn-primary" lay-event="seach">单据查找</button>
                                <button class="layui-btn layui-btn-sm lay-btn-primary" lay-event="insert">存盘并添加</button>
                                <button class="layui-btn layui-btn-sm lay-btn-primary" lay-event="copy">保存</button>
                                <button class="layui-btn layui-btn-sm lay-btn-primary" lay-event="delete">删除单据</button>
                                <button class="layui-btn layui-btn-sm lay-btn-primary" lay-event="image">单据审核</button>
                                <button class="layui-btn layui-btn-sm lay-btn-primary" lay-event="getCheckData">获取选中行数据</button>
                            </div>
                        </form>
                            <table id="goods-list"></table>
                    </div>
                </div>
            </div>
</div>
    <script type="text/html" id="toolbarDemo">
        <div class="layui-btn-container" style="display:inline-block;margin-left:20px">
        </div>
    </script>
    <script src="Content/layui/layui.js"></script>
    <script type="text/javascript">
        layui.use(['form','jquery', 'table', 'element', 'layer','laydate'], function () {
            var form = layui.form;
            var $ = layui.$;
            var laydate = layui.laydate;
            //日期
            laydate.render({
                elem:'#date'
            });
            //监听提交
            form.on('submit(formDemo)', function (data) {
                layer.msg(JSON.stringify(data.field));
                return false;
            });
            //初始化数据
            var table = layui.table;
            //第一个实例
            table.render({
                elem: '#goods-list'
                , height: 340
                , url: 'https://www.layui.com/demo/table/user' //数据接口
                , toolbar: '#toolbarDemo'
                , page: true //开启分页
                , cols: [[ //表头
                    { type: 'radio' }
                    , { field: 'orderNo', title: '序号', width: 80, sort: true }
                    , { field: 'id', title: '编号', width: 80, sort: true }
                    , { field: 'name', title: '名称', width: 100 }
                    , { field: 'size', title: '规格', width: 80, sort: true }
                    , { field: 'city', title: '单位', width: 60 }
                    , { field: 'actualStock', title: '实际库存', width: 95 }
                    , { field: 'usableStock', title: '可用库存', width: 95, sort: true }
                    , { field: 'total', title: '数量', width: 80, sort: true }
                    , { field: 'price', title: '单价', width: 60 }
                    , { field: 'sum', title: '金额', width: 80 }
                    , { field: 'taxRate', title: '税率', width: 80 }
                    , { field: 'hasTaxRateSum', title: '含税金额', width: 80 }
                    , { field: 'remark', title: '备注', width: 80 }
                ]]
            });
            var layer = layui.layer;
        });
    </script>